<!DOCTYPE html>
<HTML>
<HEAD>
  <TITLE> ZTREE DEMO - Simple Data</TITLE>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <!--
  <link rel="stylesheet" href="${base}/js/ztree/css/demo.css" type="text/css">
  -->
  <link rel="stylesheet" href="${base}/rs/plugins/ztree/metroStyle/metroStyle.css" type="text/css">
  <link rel="stylesheet" href="${base}/rs/css/bootstrap.4.0.css" type="text/css" />

  <script type="text/javascript" src="${base}/rs/js/jquery-3.2.0.min.js"></script>
  <script type="text/javascript" src="${base}/rs/plugins/ztree/jquery.ztree.core.js"></script>
  <script type="text/javascript" src="${base}/rs/plugins/ztree/jquery.ztree.excheck.js"></script>
  <script type="text/javascript" src="${base}/rs/plugins/ztree/jquery.ztree.exedit.js"></script>
  <script src="${base}/rs/js/layer/layer.js"></script>
  <script src="${base}/rs/js/layer/commont.js"></script>


  <SCRIPT type="text/javascript">
      <!--
      var type='${type}';

      var setting = {
          view: {
              addHoverDom: addHoverDom,
              removeHoverDom: removeHoverDom,
              selectedMulti: false,
              dblClickExpand: false
          },
          data: {
              simpleData: {
                  enable: true
              }
          },
          edit: {
              enable: true
          },
          callback:{
              onClick: zTreeOnClick
          }
      };

      function zTreeOnClick(e, treeId, treeNode) {
          var menuTree = $.fn.zTree.getZTreeObj("menuTree");
          menuTree.expandNode(treeNode);
      };


      $(document).ready(function(){
          initTree();
      });
      function initTree() {
          $.ajax({  //JQuery的Ajax
              type: 'POST',
              dataType : "json",//返回数据类型
              async:false,
              url: "${base}/msgMenu/listEntity?type="+type,//请求的action路径
              data: {"flag":true},  //同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行
              error: function () {//请求失败处理函数
                  alert('请求失败');
              },
              success:function(data) { //请求成功后处理函数。  取到Json对象data
                  treeNodes = data;   //把后台封装好的简单Json格式赋给treeNodes
                  $.fn.zTree.init($("#menuTree"), setting, treeNodes);
              }
          });
      }

      var newCount = 1;
      function addHoverDom(treeId, treeNode) {
          var sObj = $("#" + treeNode.tId + "_span");
          if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
          var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
              + "' title='add node' onfocus='this.blur();'></span>";
          sObj.after(addStr);
          var btn = $("#addBtn_"+treeNode.tId);
          if (btn) btn.bind("click", function(){
              var zTree = $.fn.zTree.getZTreeObj("menuTree");
              zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)});
              return false;
          });
      };
      function removeHoverDom(treeId, treeNode) {
          $("#addBtn_"+treeNode.tId).unbind().remove();
      };


      function selectTree() {
          var menuTree = $.fn.zTree.getZTreeObj("menuTree");
          var nodes = menuTree.getSelectedNodes();

          var txt = "";
          var txtName = "";
          for (var i = 0; i < nodes.length; i++) {
              if (nodes[i].isParent) {
                  //txt.replace(nodes[i].Name, "");
              } else {
                  txt += nodes[i].id+ ",";
                  txtName += nodes[i].name+",";
              }
          }
          if(txt==null || "" == txt){
              layer.alert("请选择菜单！");
              return false;
          }

          if(txt.length > 0){//如果获取到，去掉最后逗号
              txt = txt.substring(0, txt.length - 1);
              txtName=txtName.substring(0, txtName.length - 1);
          }

          //alert(txt);
          /**
           * 选择
           */
          parent.setMsgMenuTree(txt,txtName);
          var index = parent.layer.getFrameIndex(window.name);
          parent.layer.close(index)
      }

      //-->
  </SCRIPT>
</HEAD>

<BODY>
  <ul id="menuTree" class="ztree"></ul>

  <div class="form-group" >
    <div class="col-sm-12 col-sm-offset-2" style="text-align: center;">
      <button type="button" onclick="parentLayerClose()" class="btn btn-default">取消</button>
      &nbsp;&nbsp;
      <button type="button" onclick="selectTree()" class="btn btn-primary">确定</button>
    </div>
  </div>
</BODY>
</HTML>